<!DOCTYPE html>
<html lang="zh">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="common/header :: header(~{::title},~{::link},~{})">
    <title>开启点餐列表</title>
    <link rel="icon" th:href="@{/assets/img/lcxm.ico}" type="image/ico">
    <link rel="stylesheet" th:href="@{/css/common.css}">
</head>
<body class="body">
<!--导航-->
<div th:replace="common/nav :: nav(true)"></div>
<div class="container">
    <div class="row row-nocol">
        <!-- 操作信息提示的地方 -->
        <div th:if="${remind}" class="alert alert-${ remind.level  }"
             th:classappend="'alert-' + ${remind.level}">
            <button data-dismiss="alert" class="close" type="button">
                <i class="glyphicon glyphicon-remove"></i>
            </button>
            <span th:remove="tag" th:utext="${ remind.message }"></span>
        </div>
        <!--列表栏-->
        <form class="nocol">
            <div class="action-bar">
                <a class="btn btn-sm btn-success" th:href="@{/start/open}">
                    <i class="glyphicon glyphicon-plus"></i> 开启点餐
                </a>
            </div>
            <hr/>
            <table class="table table-striped  table-hover table-bordered">
                <thead>
                <tr class="text-center">
                    <th>日期</th>
                    <th>标题</th>
                    <th>结束时间</th>
                    <th>状态</th>
                    <th class="text-info">操作</th>
                </tr>
                </thead>
                <tbody align="center">
                <tr th:each="cur:${pager?.datas}">
                    <td th:text="${#dates.format(cur.date, 'yyyy-MM-dd')}">2021-12-12</td>
                    <td class="text-info detail" th:text="${cur.title}" th:attr="data-id=${cur.id}">午餐</td>
                    <td th:text="${#dates.format(cur.endTime, 'HH:mm')}">08：12</td>
                    <td th:text="${cur.enable?'开启':'关闭'}">开启</td>
                    <td>
                        <div class="btn-group-dis">
                            <!--    <a class="btn btn-xs btn-success " th:href="@{'/food/'+${cur.id}}"
                                   data-toggle="tooltip" title="编辑"> <i
                                        class="glyphicon glyphicon-edit"></i>
                                </a>-->
                            <button th:if="${(cur.enable)}" class="btn btn-xs btn-danger action-post" type="button"
                                    th:attr="data-url='/start/finish/'+${cur.id}"
                                    data-toggle="tooltip"
                                    title="结束点餐" data-confirm="确定结束点餐吗">
                                <i class="glyphicon glyphicon-remove"></i>
                            </button>

                            <button class="btn btn-xs btn-info detail" type="button"
                                    th:attr="data-id=${cur.id}"
                                    title="点餐详情"
                                    data-toggle="tooltip">
                                <i class="glyphicon glyphicon-list"></i>
                            </button>

                        </div>
                    </td>
                </tr>
                <!-- </c:forEach> -->
                </tbody>
            </table>

        </form>


        <!--页码相关-->
        <div th:replace="common/pager :: pager"></div>
    </div>


</div>

<!-- 引入通用js-->
<div th:replace="common/footer :: footer"></div>

<script>

    $(function () {
        $(".detail").on("click", function () {

                var $btn = $(this);
                showDetail($btn.data("id"));
            }
        )

    });


    function showDetail(id) {
        var url = htx + "/order/detail/" + id;
        var exportUrl = htx + "/order/exportAll?startId=" + id;
        $.alert({
            title: '点餐详情!',
            theme: 'bootstrap',
            content: "url:" + url,
            columnClass: 'col-md-8 col-md-offset-2 ',
            buttons: {
                导出: {
                    btnClass: 'btn-blue',
                    action: function () {
                        $.confirm({
                            title: '',
                            content: '确认导出吗？',
                            buttons: {
                                confirm: {
                                    text: '确定',
                                    btnClass: 'btn-red',
                                    action: function () {
                                        var $a = $('<a href="' + exportUrl + '" download="download""></a> ');
                                        $a[0].click();
                                    }
                                },
                                cancle: {
                                    text: '取消',
                                    btnClass: 'btn-info',
                                    action: function () {

                                    }
                                }
                            }
                        });
                        return false;
                    }
                },
                关闭: {
                    btnClass: 'btn-info'

                }
            }
        });
    }

</script>

</body>
</html>